<template>
  <div>
    <h2>双向绑定指令</h2>
    姓名：<input type="text" v-model.trim="from.uname" /><br />
    年龄：<input type="text" v-model.number.lazy="from.age" /><br />
    薪资：<input type="text" v-model.number.lazy="from.salary" /><br />
    <button @click="onAdd">确认添加</button>
  </div>
</template>

<script>
export default {
  data() {
    return {
      from: {
        uname: "",
        age: "",
        salary: "",
      },
    };
  },
  methods: {
    onAdd() {
      console.log("你提交的数据是：", this.from);
    },
  },
};
</script>

<style>
.box {
  width: 300px;
  height: 100px;
  background-color: cadetblue;
}
</style>